import { ProColumns, ProTable } from '@/components/Pro';
import { DATABASE_TYPE_ENUM, fetchDictInfo } from '@/utils';
import { useIntl } from '@umijs/max';
import React, { useEffect, useState } from 'react';
interface IProps {
  ProTableData: API.PcsDataDTO['dataList'];
}

export const Overview: React.FC<IProps> = ({ ProTableData }) => {
  const intl = useIntl();
  const [onlinState, setOnlieState] = useState([]);
  const [runState, setrunState] = useState([]);
  useEffect(() => {
    (async () => {
      try {
        //在线状态字典
        let OnlineState = await fetchDictInfo(DATABASE_TYPE_ENUM.ONLINE_STATUS);
        setOnlieState(OnlineState || []);

        //  运行状态字典
        let runstates = (await fetchDictInfo(DATABASE_TYPE_ENUM.PCS_STATUS)) || [];
        setrunState(runstates || []);
      } catch (error) {}
    })();
  }, []);

  const columns: ProColumns[] = [
    {
      title: intl.formatMessage({
        id: 'data.s/N',
      }),
      dataIndex: 'pageIndex',
      valueType: 'index',
    },
    {
      title: intl.formatMessage({
        id: 'stationRealtimeMonitoring.pcsControllername',
      }),
      dataIndex: 'name',
      search: false,
    },
    {
      title: intl.formatMessage({
        id: 'pcsMonitoring.onlineStatus',
      }),
      dataIndex: 'onlineState',
      search: false,
      valueType: 'select',
      render: (_, record) => {
        console.log('我看下在线状态转化没有', onlinState, record);
        let arr = onlinState.filter((res) => Number(res?.value) === Number(record?.onlineState));
        return arr[0]?.label || '--';
      },
    },
    {
      title: intl.formatMessage({
        id: 'pcsMonitoring.workingStatus',
      }),
      dataIndex: 'workState',
      search: false,
      valueType: 'select',
      render: (_, record) => {
        let arr = runState.filter((res) => Number(res?.value) === Number(record?.workState));

        return arr[0]?.label || '--';
      },
    },
    {
      title: intl.formatMessage({
        id: 'pcsMonitoring.activePower',
      }),
      dataIndex: 'activePower',
      search: false,
    },
  ];

  return (
    <ProTable
      headerTitle={intl.formatMessage({
        id: 'stationRealtimeMonitoring.pcsControllerOverview',
      })}
      columns={columns}
      dataSource={ProTableData}
      search={false}
      rowKey="key"
      pagination={{
        showQuickJumper: true,
      }}
      dateFormatter="string"
    />
  );
};
